import React, { Component } from 'react'
import './edit.css'
import service from '../../../utils/service'


export default class Rea extends Component<any, any> {
    constructor(props: any) {
        super(props)

        this.state = {
            edit: { ...this.props.location.query.record },
            nam: '',
            address: '',
            typ: '',
            run: '',
            admin: '',
            pws: '',
            tx1: ''
        }
    }

    fun03 = () => {
        if (this.state.nam == '' || this.state.address == '' || this.state.typ == '' || this.state.run == '' || this.state.admin == '' || this.state.pws == '') {
            alert('请输入内容')
        } else if (this.state.nam != '' && this.state.address != '' && this.state.typ != '' && this.state.run != '' && this.state.admin != '' && this.state.pws != '') {
            this.props.history.push('/Main/Visitor')
            service({
                url: `/passenger/${this.state.edit.id}`,
                method: 'put',
                data: {
                    name: this.state.nam,
                    time: this.state.edit.time,
                    MAC: this.state.address,
                    typ: this.state.typ,
                    sta: this.state.run
                }
            })
        }


    }
    fun04 = () => {
        this.props.history.push('/Main/Visitor')
    }
    // 双向绑定
    txt1 = (e: any) => {
        this.setState({
            nam: e.target.value
        })

    }
    txt2 = (e: any) => {
        this.setState({
            address: e.target.value
        })
    }
    txt3 = (e: any) => {
        this.setState({
            typ: e.target.value
        })
    }
    txt4 = (e: any) => {
        this.setState({
            run: e.target.value
        })
        console.log(this.state.run)
    }
    txt5 = (e: any) => {
        this.setState({
            admin: e.target.value
        })
    }
    txt6 = (e: any) => {
        this.setState({
            pws: e.target.value
        })
    }

    render() {
        return (
            <div>
                <h4>编辑访客机</h4>
                <div className='box-edit'>
                    <div className='dv' >
                        学校名称：<input disabled={true} value='西安市高新区千锋学校' className='school' />
                    </div>
                    <div className='dv'>
                        &nbsp;&nbsp;&nbsp;设备名：<input onChange={this.txt1} className='int' ></input>
                    </div>
                    <div className='dv'>
                        MAC地址：  <input className='int1' onChange={this.txt2} ></input>
                    </div>
                    <div className='dv'>
                        &nbsp;屏幕类型：<input className='int1' onChange={this.txt3} ></input>
                    </div>
                    <div className='dv'>
                        运行状态：<input className='int1' onChange={this.txt4} ></input>
                    </div>
                    <div className='dv'>
                        &nbsp;用户名：<input className='int1' onChange={this.txt5} ></input>
                    </div>
                    <div className='dv'>
                        &nbsp;&nbsp;&nbsp;&nbsp;密码：<input className='int1' onChange={this.txt6} ></input>
                    </div>
                    <div className='dv'>
                        <button onClick={this.fun03} style={{ backgroundColor: '#1890FF', border: 'none', color: '#FFF', width: '80px', height: '35px', borderRadius: '4px', marginLeft: '15px', fontSize: '13px' }}>确定</button>
                        <button onClick={this.fun04} style={{ backgroundColor: '#FFF', border: '1px solid rgb(228, 228, 228)', color: '#333', width: '80px', height: '35px', borderRadius: '4px', marginLeft: '15px', fontSize: '13px' }}>取消</button>

                    </div>
                </div>
            </div>
        )
    }
}
